<!doctype html> <!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7 ]> <html class="no-js ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]>    <html class="no-js ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]>    <html class="no-js ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<html class="no-js" lang="en">
	<!--<![endif]-->
	<head>
		<meta charset="utf-8" />
		<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
		Remove this if you use the .htaccess -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<title>Home Page</title>
		<meta name="description" content="" />
		<meta name="author" content="mODY" />
		<meta name="viewport" content="width=device-width; initial-scale=1.0" />
		<!-- JavaScripts -->
		<script src="js/mylibs/jquery.min.js"></script>
		<script src="js/mylibs/jquery.easing-1.3.pack.js"></script>
		<script src="js/mylibs/jquery.fancybox-1.3.4.js"></script>
		<script src="js/mylibs/jquery.mousewheel-3.0.4.pack.js"></script>
		<script src="js/mylibs/jqbanner.js"></script>
		<script>
			$(function() {
				$('#nav>ul>li>a').click(function() {
					id = $(this).attr('id');
					var iframe = document.getElementById('iframec');
					if(id == 'announcement')
						iframe.src = 'ListAnnouncements.html';
					else if(id == 'search')
						iframe.src = 'search.html';
					else if(id == 'articles')
						iframe.src = 'articlesList.html';
					else if(id == 'reports')
						iframe.src = 'reportComplaint.html'
					else if(id == 'myroutes')
						iframe.src = 'my_routes.html';

					$('.selected').removeClass('selected');
					$(this).parent().addClass('selected');
				});
			});

		</script>
		<!-- CSS -->
		<link rel="stylesheet" href="css/style.css" />
		<link rel="stylesheet" href="css/jquery.fancybox-1.3.4.css" />
		<link rel="stylesheet" media="screen" href="css/jqbanner.css" />
		<!-- Replace favicon.ico & apple-touch-icon.png in the root of your domain and delete these references -->
		<link rel="shortcut icon" href="/favicon.ico" />
		<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
	</head>
	<body>
		<div id="container">
			<div id="main" role="main">
				<header>
					<h1>Aroo7 Ezay?</h1>
					<div class="aux">
						Welcome, UserName <a href="#" id="logout">Logout </a>
					</div>
				</header>
				<div id="jqb_object" align="center" class="banner">
					<div class="jqb_slides">
						<div id="text1" class="jqb_slide" title="Text1">
							<span>* (NEW) Metro line 5 *</span>
						</div>
						<div id="text2" class="jqb_slide" title="Text2">
							<span>* Route of bus 113 changed *</span>
						</div>
						
					</div>
				</div>
				<div id="nav">
					<ul>
						<li class="selected">
							<a id="search" href="#" >Search</a>
						</li>
						<li>
							<a  id="myroutes" href="#">My Routes</a>
						</li>
						<li>
							<a  id="announcement" href="#">Announcments</a>
						</li>
						<li>
							<a  id="articles" href="#">Articles</a>
						</li>
						<li>
							<a  id="reports" href="#">Report A Complaint</a>
						</li>
					</ul>
				</div>
				<div id="content">
					<iframe id="iframec" allowtransparency="yes" src="search.html"></iframe>
				</div>
			</div>
			<footer style="color: white;">
				&copy; Aroo7 Ezay, 2011
			</footer>
		</div>
	</body>
</html>
